<!-- standard -->
<template>
  <div class="promoteA">
    <div class="flex align-center">
      <span class="">方案名称：</span>
      <el-select
        v-model="valueId"
        placeholder="请选择"
        :disabled="calcDisabled"
      >
        <el-option
          v-for="item in options"
          :key="item.Id"
          :label="item.Sname"
          :value="item.Id"
        >
        </el-option>
      </el-select>
      <el-button
        v-if="alldisabled && options && options.length == 0"
        type="info"
        class="m-l-1"
        @click="toPath()"
        >新增</el-button
      >
    </div>
    <div class="m-t-1 m-b-1 flex flex-wrap">
      <div class="flex m-b-1 align-center w-100">
        <span class="">总交易量：</span>
        <el-input
          type="number"
          v-model="obj.TotalTarget"
          min="0"
          @keyup.native="proving2($event)"
          class="flex-1"
        >
          <template slot="append">元</template>
        </el-input>
      </div>
      <div class="flex m-b-1 align-center">
        <span class="">奖励上限团队数：</span>
        <el-input
          type="number"
          v-model="obj.LimitTeam"
          min="0"
          @keyup.native="proving2($event)"
          class="flex-1"
        >
          <template slot="append">个</template>
        </el-input>
      </div>
      <div class="flex m-b-1 align-center w-100">
        <span class="">备注：</span>
        <el-input
          type="textarea"
          :disabled="alldisabled"
          placeholder="请输入内容"
          v-model="obj.Remark"
          maxlength="30"
          show-word-limit
        />
      </div>
      <div class="auto-scroll">
        <div class="flex m-t-1 align-center space-between ladder_item">
          <div class="flex-1">
            <div
              class="flex align-center space-between ladder_cell"
              v-for="(cell, idx) of Settings"
              :key="idx"
            >
              <div class="m-r-2">
                <div class="flex align-center m-b-2">
                  <span>
                    {{ cell.Sname }}
                  </span>
                </div>
                <!-- <el-date-picker
                  class="flex-1"
                  v-model="cell.timeValue"
                  value-format="yyyy-MM-dd hh:mm:ss"
                  type="datetimerange"
                  range-separator="至"
                  start-placeholder="开始日期"
                  end-placeholder="结束日期"
                  :disabled="alldisabled"
                >
                </el-date-picker> -->
              </div>
              <div class="info_group">
                <div class="flex align-center">
                  <span class="tit_span nowarp">达标团队数：</span>
                  <el-input
                    type="number"
                    v-model="cell.Target"
                    class="flex-1"
                    :disabled="alldisabled"
                    min="0"
                    @keyup.native="proving2($event)"
                  >
                    <template slot="append">个</template>
                  </el-input>
                </div>
                <div class="flex align-center">
                  <span class="tit_span nowarp">档次奖励：</span>
                  <el-input
                    type="number"
                    v-model="cell.Award"
                    class="flex-1"
                    :disabled="alldisabled"
                    min="0"
                    @keyup.native="proving2($event)"
                  >
                    <template slot="append">元</template>
                  </el-input>
                </div>
                <!-- <div class="flex align-center">
                  <span class="tit_span nowarp">奖励上限：</span>
                  <el-input
                    type="number"
                    v-model="cell.LimitMoney"
                    class="flex-1"
                    :disabled="alldisabled"
                    min="0"
                    @keyup.native="proving2($event)"
                  >
                    <template slot="append">元</template>
                  </el-input>
                </div> -->
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <el-button type="primary" style="float: right" @click="SaveCorrsFun()">{{
      "保存"
    }}</el-button>
  </div>
</template>

<script>
import { SaveCorrs, GetCorrList } from '@/api/system/user'
import { getList, getExpandDetail, save } from '@/api/EquityManage/qualiAllow'
export default {
  //import引入的组件需要注入到对象中才能使用
  name: 'promoteA',
  components: {},
  data () {
    //这里存放数据
    return {
      valueId: '',
      options: null,
      obj: {},
      Settings: []
    };
  },
  props: {
    alldisabled: {
      type: Boolean,
      default: false
    },
    RoleId: {
      type: String,
      default: ''
    },
    IdentityId: {
      type: String,
      default: ''
    },
    IsSystem: {
      type: Number,
      default: 2
    }
  },
  //监听属性 类似于data概念
  computed: {
    calcDisabled () {
      if (this.IsSystem == 3 || this.IsSystem == 4) {
        return false
      } else {
        return this.alldisabled
      }
    }
  },
  //监控data中的数据变化
  watch: {
    valueId (val) {
      if (val) {
        this.obj = this.options.find(item => item.Id == val)
        // this.obj = { ...this.obj, timeValue: [this.obj.StartTime, this.obj.EndTime] }
        this.getExpandDetailFun(val)
      }

    },
  },
  //方法集合
  methods: {
    toPath (stype) {
      this.$router.push('/equityManage/powerManage/qualiAllow')
    },
    async getListFun () {
      let obj = { IsPaging: false }
      // if (this.alldisabled || this.IsSystem == 3 || this.IsSystem == 4) {
      obj.IsSystem = 1
      // }
      let { Data } = await getList(obj)
      this.options = Data || []
    },
    async getExpandDetailFun (val, type = 'ID') {
      let obj = {
        IsPaging: false,
        Id: val
      }
      if (type == 'User') {
        // obj.UserId = val
        obj.RoleId = val
        obj.IsSystem = 2
        delete obj.Id
      } else if (type == 'comp') {
        obj.OrgId = val
        obj.IsSystem = 3
        delete obj.Id
      } else if (type == 'team') {
        obj.RoleId = val
        obj.IsSystem = 4
        delete obj.Id
      }
      let { Data } = await getExpandDetail(obj)
      if (type == 'User' || type == 'comp' || type == 'team') {
        this.options = [Data] || []
        this.valueId = Data.Id
        this.Settings = Data.Mains || Data.Settings || []
        this.hasId = Data.Id
        //this.vHas = true 如果是用户  用户的必定已经存在一个默认方案 如果已改过 就变成了身份方案 这个时候ID就不用变为0   如果未改过  就还是团队方案 这个时候改的话  就需要把ID全变为0
      } else {
        this.Settings = Data.Settings || []
      }
      // for (let item of this.Settings) {
      //   item.timeValue = []
      //   item.timeValue[0] = item.StartTime
      //   item.timeValue[1] = item.EndTime
      // }
    },
    async GetCorrListFun () {
      let role = ''
      if (this.alldisabled) {
        role = this.RoleId
      } else {
        role = this.IdentityId
        if (this.IsSystem == 3 || this.IsSystem == 4) {
          //如果是公司
          return
          role = this.RoleId
        }
      }
      let { Data } = await GetCorrList({ IsPaging: false, Id: role })
      Data.forEach(element => {
        if (element.TacticsName == '管理津贴') {
          this.valueId = element.TacticsId
        }
      });
    },
    SaveCorrsFun () {
      if (this.alldisabled) {
        let tid = this.valueId
        let obj =
        {
          "RoleId": this.RoleId, //用户身份角色Id
          "TacticsId": tid, //系统策略Id
          "TacticsName": '管理津贴' //对应策略Tab名称
        }
        SaveCorrs(obj).then(res => {
          this.$notify({
            title: '保存成功',
            message: 'success',
            type: 'success',
            duration: 2000
          })
        })
      } else {
        let obj = this.$deepClone(this.obj)

        if (this.IsSystem == 3) {
          obj.OrgId = this.RoleId
        } else if (this.IsSystem == 4) {
          obj.RoleId = this.RoleId
        } else {
          // obj.UserId = this.RoleId
          obj.RoleId = this.RoleId

        }
        if (this.hasId != obj.Id) { //如果是用户  用户的必定已经存在一个默认方案 如果已改过 就变成了用户方案 这个时候ID就不用变为0   如果未改过  就还是团队方案 这个时候改的话  就需要把ID全变为0
          obj.Id = '00000000-0000-0000-0000-000000000000'
          let list = this.changeIdtoZero()
          obj.Settings = list
        } else {
          obj.Settings = this.Settings
        }
        // for (let item of obj.Settings) {
        //   item.StartTime = item.timeValue[0]
        //   item.EndTime = item.timeValue[1]
        //   delete item.timeValue
        // }

        obj.IsSystem = this.IsSystem
        save(obj).then(res => {
          this.resetdataFun()

          this.$notify({
            title: '保存成功',
            message: 'success',
            type: 'success',
            duration: 2000
          })
        })
      }

    },
    changeIdtoZero () {
      let list = this.$deepClone(this.Settings)
      for (let item of list) {
        item.Id = '00000000-0000-0000-0000-000000000000'

      }
      return list
    },
    resetdataFun () {
      if (this.alldisabled) {
        this.getListFun().then(_ => {
          // this.GetCorrListFun()
        })
      } else {
        let type = 'User'
        if (this.IsSystem == 3 || this.IsSystem == 4) {
          this.IsSystem == 3 && (type = 'comp')
          this.IsSystem == 4 && (type = 'team')
          this.getListFun().then(_ => {
            this.getExpandDetailFun(this.RoleId, type).catch(err => {
              // console.log('第一次打开 没找到可能存在的 已修改的 条目 则在报错的阶段 重新执行另外一条逻辑')
              this.getListFun().then(_ => {
                // this.GetCorrListFun()
              })
            })
          })
        } else {
          this.getExpandDetailFun(this.RoleId, type).then(_ => {
            this.getListFun()
          }).catch(err => {
            // console.log('第一次打开 没找到可能存在的 已修改的 条目 则在报错的阶段 重新执行另外一条逻辑')
            this.getListFun().then(_ => {
              // this.GetCorrListFun()
            })
          })
        }
        //用户 打开的策略配置

      }
    }
  },
  //生命周期 - 创建完成（可以访问当前this实例）
  created () {


  },
  //生命周期 - 挂载完成（可以访问DOM元素）
  mounted () {
    this.resetdataFun()
  },
  beforeCreate () { }, //生命周期 - 创建之前
  beforeMount () { }, //生命周期 - 挂载之前
  beforeUpdate () { }, //生命周期 - 更新之前
  updated () { }, //生命周期 - 更新之后
  beforeDestroy () { }, //生命周期 - 销毁之前
  destroyed () { }, //生命周期 - 销毁完成
  activated () { }, //如果页面有keep-alive缓存功能，这个函数会触发
}
</script>
//@import url(); 引入公共css类
<style  scoped>
.tit_span + .el-input {
  width: 150px;
}
.el-textarea {
  flex: 1;
  width: auto;
}
.auto-scroll {
  width: 100%;
}
.info_group {
  width: 65%;
}
/* .promoteB >>> .el-dialog {
  min-width: 560px;
} */

.ladder_item {
  width: 95%;
  border-bottom: 1px solid #cecece;
  padding: 5px 0;
}
.ladder_cell + .ladder_cell {
  border-top: 2px dashed #f6bcbc;
}
.ladder_cell {
  padding: 5px 0;
}
.ladder_name {
  /* width: 100px !important; */
  margin-right: 3%;
}

.el-icon-circle-close {
  font-size: 18px;
  transition: color 0.25s linear;
}
.el-icon-circle-close:hover {
  color: #cecece;
  cursor: pointer;
}
.table_ladname {
  width: 30%;
  font-size: 16px;
}
</style>